import React, { Component } from 'react'
// 到入样式
import './MyGoods.scss'
import pic2 from '../imags/pic2.jpeg'

export default class MyGoods extends Component {
    constructor(props) {
        super(props);
        this.state = {
            classlist: [
                '综合', '效率', '新品', '价格', '筛选'
            ],
            goodslist: [
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2,oldprice: '原价 ￥270',price: '活动价 ￥215'},
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2, oldprice: '原价 ￥270', price: '活动价 ￥215' },
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2, oldprice: '原价 ￥270', price: '活动价 ￥215' },
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2, oldprice: '原价 ￥270', price: '活动价 ￥215' },
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2, oldprice: '原价 ￥270', price: '活动价 ￥215' },
                { title: 'COSME DECOPTE 黛珂植物欣韵沁莹化妆水', pic: pic2, oldprice: '原价 ￥270', price: '活动价 ￥215' },
            ]
        }
    }
    render() {
        return (
            <div className="mylist">
                <div className="sortclass">
                    <div className="toplist">
                        {
                            this.state.classlist.map((item) => {
                                return (
                                    <span>{item}</span>
                                )
                            })
                        }

                    </div>
                    <div className="botlist">
                        {
                            this.state.goodslist.map((item) => {
                                return (
                                    <div className="goods">
                                        <img src={item.pic} alt="" />
                                        <div className="title">{item.title}</div>
                                        <div className='oldprice'>{item.oldprice}</div>
                                        <div className='price'>{item.price}</div>
                                    </div>
                                )
                            })
                        }
                    </div>
                </div>
            </div>
        )
    }
}